<template>
  <div>
    <div class="stu-detl-container">
      <div class="detl_title">
        <span>
          <img src="~images/default/student_class.png" alt="" v-if="cardIcon === 'class'">
          <img src="~images/default/student_dormitory.png" alt="" v-if="cardIcon === 'dormitory'">
        </span>
        <!-- 图 -->
        <span>{{title}}</span>
        <span>{{cardName}}</span>
      </div>
      <!-- 学院信息 -->
      <div v-show="persArray.length > 1">
         <div v-for="(item,index) in persArray" :key="index">
          <ConPers
            :info="item"
            :title="persInfo.college_name"
          />
        </div>
      </div>
      <!-- 无数据 -->
      <div class="no-data-bg" v-show="persArray.length < 1">
        <van-empty description="暂无数据" />
      </div>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    title: {
      type: String,
      default: '宿舍信息',
    },
    cardIcon: {
      type: String,
      default: 'dormitory',
    },
    persInfo: {
      type: Object,
      default:()=> {},
    },
    persArray: {
      type: Array,
      default:()=> [],
    },
    cardName: {
      type: String,
      default: '标题',
    },
  },
}
</script>
<style lang="scss" scoped>
.stu-detl-container {
  width: 345px;
  background: #ffffff;
  box-shadow: 0px 2px 15px 0px rgba(0, 0, 0, 0.19);
  border-radius: 5px;
  margin-bottom: 10px;
  overflow: hidden;
  .detl_title {
    position: relative;
    display: flex;
    border-radius: 5px 5px 0 0;
    width: 345px;
    height: 36px;
    background: #eeeff3;
    span {
      &:first-child {
        img{
          position: absolute;
          top: 11px;
          left: 24px;
          width: 14px;
          height: 14px;
        }
      }
      &:nth-child(2) {
        position: absolute;
        top: 12px;
        left: 48px;
        font-size: 12px;
        font-family: PingFangSC-Semibold, PingFang SC;
        font-weight: 600;
        color: #8c97b2;
      }
      &:nth-child(3) {
        position: absolute;
        top: 11px;
        right: 24px;
        font-size: 14px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #002170;
      }
    }
  }
  .no-data-bg {
    height: 240px;
  }
}
</style>